import { Component } from '@angular/core';
import { Actor, Clue, Event, Express, Group, Location, Note, Panorama, Story, Stuff, Task } from 'src/classes/entities';
import { CommonService } from 'src/services/common.service';
import { DataService } from 'src/services/data.service';
import { StoreService } from 'src/services/store.service';
import { UiService } from 'src/services/ui.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  constructor(public store: StoreService, public data: DataService, public ui: UiService) {

  }
  title = 'visualstory';
  logoSrc = 'https://res.hc-cdn.com/x-roma-components/1.0.10/assets/devui/logo.svg';
  showpanel = 'entity'
  restrictOneOpen = false;
  accordionTypeEmbed = false;
  topmenu = [
    {
      title: 'File',
      children: [
        {
          title: 'Open',
          click: () => {
            // var file = document.getElementById('openFile')
            // file.click()
            let r = CommonService.open('openFile', (r) => this.store.currentStory = JSON.parse(r))
            // if (r !== undefined || r !== '')
            //   this.store.currentStory = JSON.parse(r)
          }
        },
        {
          title: 'Save',
          click: () => {
            console.log('save');
            CommonService.save(this.store.currentStory, 'story.json')
          }
        },
        {
          title: 'New',
          click: () => { console.log('new'); this.store.currentStory = new Story() }
        },

      ]
    },
    {
      title: 'Edit',
      children: [
        {
          title: 'Copy',
          click: () => { console.log('copy'); this.store.operatingEntity = this.store.currentEntity }
        },
        {
          title: 'Paste',
          click: () => { console.log('paste'); if (this.store.pasteFunction !== undefined) this.store.pasteFunction() }
        },
      ]
    }
  ]
  handleFileSelect(evt) {
    var files = evt.target.files;
    var f = files[0];
    var reader = new FileReader();

    reader.readAsText(f);
    reader.onload = ((f) => {
      return (e) => {

        this.store.currentStory = JSON.parse(e.target.result)

      };
    })(f);
  }
  tabActiveId = 'tab1';
  activeTabData;
  tabItems = [
    {
      id: 'tab1',
      title: 'Tab1',
      disabled: true,
      content: `Tab1 Content`
    },
    {
      id: 'tab2',
      title: 'Tab2',
      content: `Tab2 Content`
    },
    {
      id: 'tab3',
      title: 'Tab3',
      content: `Tab3 Content`
    },
  ];
  activeTabChange(tab) {
    this.activeTabData = this.tabItems.filter(item => item.id === tab)[0];
  }
  ngOnInit() {
  }

  log(...v) {
    console.log(...v);
  }
  public onSearch(e) {

  }
  addentity() {
    if (this.ui.activePanel === 'Actor') {

      let entity = new Actor()
      console.log(JSON.stringify(entity));
      this.data.addEntity<Actor>(entity)
    }
    if (this.ui.activePanel === 'Clue') {

      let entity = new Clue()
      console.log(JSON.stringify(entity));
      this.data.addEntity<Clue>(entity)
    }
    if (this.ui.activePanel === 'Event') {

      let entity = new Event()
      console.log(JSON.stringify(entity));
      this.data.addEntity<Event>(entity)
    }
    if (this.ui.activePanel === 'Group') {

      let entity = new Group()
      console.log(JSON.stringify(entity));
      this.data.addEntity<Group>(entity)
    }
    if (this.ui.activePanel === 'Location') {

      let entity = new Location()
      console.log(JSON.stringify(entity));
      this.data.addEntity<Location>(entity)
    }
    if (this.ui.activePanel === 'Stuff') {

      let entity = new Stuff()
      console.log(JSON.stringify(entity));
      this.data.addEntity<Stuff>(entity)
    }
    if (this.ui.activePanel === 'Task') {

      let entity = new Task()
      console.log(JSON.stringify(entity));
      this.data.addEntity<Task>(entity)
    }

    if (this.ui.activePanel === 'Panorama') {

      let entity = new Panorama()
      console.log(JSON.stringify(entity));
      this.data.addPanorama(entity)

    }
    if (this.ui.activePanel === 'Express') {

      let entity = new Express()
      console.log(JSON.stringify(entity));
      this.data.addExpress(entity)
    }
    if (this.ui.activePanel === 'Note') {

      let entity = new Note()
      console.log(JSON.stringify(entity));
      this.data.addNote(entity)
    }
  }
  removeentity() {

  }
}
